@extends('user.layouts.head')
@section('content')
    <body>
    <div id="app">
        <div class="wrapper -header-fixed">

        @include('user.layouts.navbar')
        @include('user.layouts.sidebar')

        <!-- 内容页开始-->
            <div class="content-container">

                <div class="container-fluid">
                    <div class="page-content">

                        <div class="card">
                            <div class="card-body">

                                <div class="col-7">
                                    <div class="row">
                                    <div class="col-2">
                                        <div class="list-group list-group-flush" id="list-tab">
                                            <a class="list-group-item list-group-item-action active" data-toggle="list" href="#list-contact"><i class="fa fa-address-card-o"></i> {{ __('个人资料') }}
                                            </a>
                                            <a class="list-group-item list-group-item-action" data-toggle="list" href="#list-password"><i class="fa fa-key"></i> {{ __('修改密码') }}
                                            </a>
                                            <a class="list-group-item list-group-item-action" data-toggle="list" href="#list-promote"><i class="fa fa-flag-checkered"></i> {{ __('游戏推广') }}
                                            </a>
                                        </div>
                                    </div>
                                    <div class="col-8">
                                        <div class="tab-content" id="nav-tabContent">
                                            <div class="tab-pane fade show active" id="list-contact">
                                                <div class="form-group row">
                                                    <label>{{ __('　　账号：') }}</label>
                                                    <div class="col-xl-7">
                                                        <input type="text" class="form-control" id="name" maxlength="5" value="{{ $user->username }}">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label>{{ __('邮箱地址：') }}</label>
                                                    <div class="col-xl-7">
                                                        @if( $user->email_verified_at )
                                                            <div class="input-group">
                                                                <input type="text" class="form-control" id="email" value="{{ substr_replace($user->email,'****','3','4') }}" readonly>
                                                            </div>
                                                            <small class="text-success pull-right">{{ __('邮箱已认证') }}</small>
                                                        @else
                                                            <input type="text" class="form-control" id="email" value="{{ $user->email }}">
                                                        @endif
                                                    </div>
                                                </div>
                                                <button type="submit" class="btn btn-primary mb-3" onclick="personal()">{{ __('提交') }}</button>
                                            </div>

                                            <div class="tab-pane fade" id="list-password">
                                                <div class="form-group row">
                                                    <label>{{ __('　旧密码：') }}</label>
                                                    <div class="col-xl-7">
                                                        <input type="password" class="form-control" id="original_password">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label>{{ __('　新密码：') }}</label>
                                                    <div class="col-xl-7">
                                                        <input type="password" class="form-control" id="password">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label>{{ __('确认密码：') }}</label>
                                                    <div class="col-xl-7">
                                                        <input type="password" class="form-control" id="password_confirmation">
                                                    </div>
                                                </div>
                                                <button type="submit" class="btn btn-primary mb-3" onclick="change_password()">{{ __('提交') }}</button>

                                            </div>
                                            <div class="tab-pane fade" id="list-promote">
                                                {{ __('还未开发') }}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                </div>
                            </div> <!-- .card-body -->

                        </div> <!-- .card -->

                    </div> <!-- .page-content -->
                </div> <!-- .container-fluid -->
            </div> <!-- .content-container -->
        </div> <!-- .wrapper -->
    </div> <!-- #app -->
    <script src="{{ mix('js/app.js') }}"></script>
    <script src="{{ asset('/js/main.js') }}"></script>
    <script>

        let isLoading = false;

        function personal() {

            if (!$('#name').val()) {
                toast('请输入姓名。');
                return false
            }
            if (!$('#phone').val()) {
                toast('请输入手机号码。');
                return false
            }
            if (!$('#email').val()) {
                toast('请输入邮箱地址。');
                return false
            }

            if (isLoading === false) {
                isLoading = true;
                axios.post('{{ route('personal.store') }}', {
                    type: 1,
                    name: $('#name').val(),
                    son: $('#son').val(),
                    phone: $('#phone').val(),
                    email: $('#email').val()
                })
                    .then(function (response) {
                        isLoading = false;
                        toast_tip2(response.data.message, '{{ route('personal.index') }}');
                    })
                    .catch(function (error) {
                        isLoading = false;
                        $.each(error.response.data.errors, function (index, object) {
                            toast(object[0]);
                            return false;
                        });
                    })
            }
        }

        let isLoading = false;

        function change_password() {

            if (!$('#original_password').val()) {
                toast('原始密码 不能为空');
                return false
            }
            if (!$('#password').val()) {
                toast('新密码 不能为空。');
                return false
            }
            if (!$('#password_confirmation').val()) {
                toast('确认密码 不能为空。');
                return false
            }

            if (isLoading === false) {
                isLoading = true;

                axios.post('{{ route('personal.store') }}', {
                    type: 2,
                    original_password: $('#original_password').val(),
                    password: $('#password').val(),
                    password_confirmation: $('#password_confirmation').val()
                })
                    .then(function (response) {
                        isLoading = false;
                        toast_tip2(response.data.message, '{{ route('personal.index') }}');
                    })
                    .catch(function (error) {
                        isLoading = false;
                        $.each(error.response.data.errors, function (index, object) {
                            toast(object[0]);
                            return false;
                        });
                    })
            }
        }

        let isLoading = false;

        function verify_phone(val) {

            if (!$('#phone').val()) {
                toast('请到个人资料中填写您的手机号码。');
                return false
            }

            if (isLoading === false) {
                isLoading = true;
                setTime(val);
                axios.post('{{ route('verify.phone.store') }}', {
                    phone: $('#phone').val()
                })
                    .then(function (response) {
                        isLoading = false;
                    })
                    .catch(function (error) {
                        isLoading = false;
                        $.each(error.response.data.errors, function (index, object) {
                            toast(object[0]);
                            return false;
                        });
                    })
            }
        }

        let isLoading = false;

        function verify_email(val) {

            if (isLoading === false) {
                isLoading = true;
                setTime(val);
                axios.get('{{ route('verification.resend') }}')
                    .then(function (response) {
                        isLoading = false;
                    })
                    .catch(function (error) {
                        isLoading = false;
                        $.each(error.response.data.errors, function (index, object) {
                            toast(object[0]);
                            return false;
                        });
                    })
            }
        }

        // 倒计时
        let countDown = 60;

        function setTime(val) {
            if (countDown == 0) {
                val.removeAttribute("disabled");
                val.value = "重新获取";
                countDown = 60;
                return;
            } else {
                val.setAttribute("disabled", true);
                val.value = countDown + "秒后，重新发送";
                countDown--;
            }
            setTimeout(function () {
                setTime(val)
            }, 1000)
        }

        // 验证短信验证码
        let isLoading = false;

        function verify_code() {

            if (!$('#phone').val()) {
                toast('请到个人资料中填写您的手机号码。');
                return false
            }

            if (!$('#code').val()) {
                toast('验证码 不能为空。');
                return false
            }

            if (isLoading === false) {

                isLoading = true;

                axios.patch('{{ route('verify.phone.update','').'/' }}' + $('#code').val() + '', {
                    phone: $('#phone').val(),
                })
                    .then(function (response) {
                        isLoading = false;
                        toast_tip2(response.data.message, '{{ route('personal.index') }}');
                    })
                    .catch(function (error) {
                        isLoading = false;
                        $.each(error.response.data.errors, function (index, object) {
                            toast(object[0]);
                            return false;
                        });
                    })
            }
        }

    </script>
    </body>

@endsection
